<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	template="/pages/template.xhtml">

	<ui:define name="body">
		<f:view id="vResultadosMundial">

			<div class="polla_panel_tab">

				<p:tabView id="tabResultadosMundial">

					<p:tab id="calendario" title="Calendario">

						<div class="polla_area">
							<p:accordionPanel value="#{resultadosMundialBean.fases}"
								var="fase">
								<p:tab title="#{fase.nombre}">
									<p:dataGrid var="partido" value="#{fase.partidoList}"
										columns="1" rows="8" paginator="false">

										<p:tooltip for="panelPartido"
											value="#{resultadosMundialBean.getFormatoFecha(partido.fecha)}"
											showEffect="slide" hideEffect="slide" />
										<h:panelGrid columns="2" width="500" styleClass="polla_panel"
											columnClasses="area_alignmentLeft, area_alignmentRight"
											id="panelPartido">
											<h:panelGroup>
												<h:panelGrid columns="3"
													columnClasses="image_left, alignmentLeft, alignmentRight"
													width="200">
													<p:graphicImage
														value="/images/escudos/#{partido.idequipoUno.escudo}"
														styleClass="image_left" />

													<h:outputText value="#{partido.idequipoUno.nombre}"
														id="slide" />
													<h:outputText
														value="#{resultadosMundialBean.obtenerResultadoUno(partido)}" />
												</h:panelGrid>
											</h:panelGroup>
											<h:panelGroup>
												<h:panelGrid columns="3"
													columnClasses="alignmentLeft, alignmentRight, image_right"
													width="200">
													<h:outputText
														value="#{resultadosMundialBean.obtenerResultadoDos(partido)}" />

													<h:outputText value="#{partido.idequipoDos.nombre}"
														id="slide2" />

													<p:graphicImage
														value="/images/escudos/#{partido.idequipoDos.escudo}"
														styleClass="image_right" />
												</h:panelGrid>
											</h:panelGroup>
										</h:panelGrid>

									</p:dataGrid>

								</p:tab>
							</p:accordionPanel>
						</div>

					</p:tab>

<!-- 					<p:tab id="posiciones" title="Posiciones"> -->

<!-- 						<div class="polla_area"> -->
<!-- 							<p:accordionPanel value="#{resultadosMundialBean.fases}" -->
<!-- 								var="fase"> -->
<!-- 								<p:tab title="#{fase.nombre}"> -->
<!-- 									<p:dataTable var="equipo" -->
<!-- 										value="#{resultadosMundialBean.getPosicionEquipos(fase)}"> -->
<!-- 										<p:column headerText="Equipo"> -->
<!-- 											<h:outputText value="#{equipo.equipo.nombre}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="PJ"> -->
<!-- 											<h:outputText value="#{equipo.partidosJugados}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="PG"> -->
<!-- 											<h:outputText value="#{equipo.partidosGanados}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="PE"> -->
<!-- 											<h:outputText value="#{equipo.partidosEmpatados}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="PP"> -->
<!-- 											<h:outputText value="#{equipo.partidosPerdidos}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="GF"> -->
<!-- 											<h:outputText value="#{equipo.golesFavor}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="GC"> -->
<!-- 											<h:outputText value="#{equipo.golesContra}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="DG"> -->
<!-- 											<h:outputText value="#{equipo.diferenciaGol}" /> -->
<!-- 										</p:column> -->
<!-- 										<p:column headerText="Puntos"> -->
<!-- 											<h:outputText value="#{equipo.puntos}" /> -->
<!-- 										</p:column> -->
<!-- 									</p:dataTable> -->
<!-- 								</p:tab> -->
<!-- 							</p:accordionPanel> -->
<!-- 						</div> -->
<!-- 					</p:tab> -->

					<p:tab id="proximosPartidos" title="Próximos Partidos">

						<div class="polla_area">
							<p:accordionPanel value="#{resultadosMundialBean.fechas}"
								var="fecha">
								<p:tab title="#{fecha}">

									<p:dataGrid var="partido"
										value="#{resultadosMundialBean.partidosFecha.get(fecha)}"
										columns="1" rows="6" paginator="false">

										<p:tooltip for="panelPartido"
											value="#{resultadosMundialBean.getFormatoHora(partido.fecha)}"
											showEffect="slide" hideEffect="slide" />
										<h:panelGrid columns="3" width="500" styleClass="polla_panel"
											columnClasses="area_alignmentLeft, area_alignmentRight"
											id="panelPartido">
											<h:panelGroup>
												<h:panelGrid columns="3"
													columnClasses="image_left, alignmentLeft, alignmentRight"
													width="200">
													<p:graphicImage
														value="/images/escudos/#{partido.idequipoUno.escudo}"
														styleClass="image_left" />

													<h:outputText value="#{partido.idequipoUno.nombre}"
														id="slide" />
													<h:outputText
														value="#{resultadosMundialBean.obtenerResultadoUno(partido)}" />
												</h:panelGrid>
											</h:panelGroup>
											<h:panelGroup>
												<h:panelGrid columns="3"
													columnClasses="alignmentLeft, alignmentRight, image_right"
													width="200">
													<h:outputText
														value="#{resultadosMundialBean.obtenerResultadoDos(partido)}" />

													<h:outputText value="#{partido.idequipoDos.nombre}"
														id="slide2" />

													<p:graphicImage
														value="/images/escudos/#{partido.idequipoDos.escudo}"
														styleClass="image_right" />
												</h:panelGrid>
											</h:panelGroup>
											<p:commandButton update=":formMarcadores:marcadorDetail"
												oncomplete="PF('marcadorDialog').show()"
												icon="ui-icon-search" title="View"
												actionListener="#{administracionBean.consultarMarcadoresConId(partido.idpartido)}">
											</p:commandButton>
										</h:panelGrid>

									</p:dataGrid>

								</p:tab>
							</p:accordionPanel>
						</div>

					</p:tab>
				</p:tabView>

			</div>

		</f:view>
	</ui:define>
</ui:composition>